<!-- 任务执行情况 -->
<template>
  <el-dialog title="复本率" :visible.sync="dialogVisible" @close="closePage"
             :close-on-click-modal="false">
    <div>
      <el-table
        ref="multipleTable"
        :data="arryList"
        tooltip-effect="dark"
        header-cell-class-name="table-text-c"
        height="400"
        cell-class-name="table-text-c">
        <el-table-column
          label="书本数量/册"
          align="center"
          prop="num">
        </el-table-column>
        <el-table-column
          align="center"
          prop="id"
          label="书本总类">
          <template slot-scope="scope">
            {{ scope.row.repeat_number }}
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="id"
          label="重复率">
          <template slot-scope="scope">
            {{ sumRate(scope.row) }}
          </template>
        </el-table-column>
      </el-table>
      <!--工具条 分页-->
      <el-col :span="24" class="toolbar">
        <el-pagination
          background
          :page-size="page.pagesize"
          :current-page="page.pageindex"
          layout="total, prev, pager, next"
          :total="page.total"
          @current-change="handleSizeChange"></el-pagination>
      </el-col>
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button @click="closePage" size="small">取 消</el-button>
      <el-button type="primary" @click="foodCheck()" size="small">确 定</el-button>
    </div>
  </el-dialog>

</template>
<script>
import {pagination} from '@/utils/util.js'
import {bookRepeat} from '@/api/admin/book'

export default {
  name: 'taskListDialog',
  props: ['visible', 'rankingType'],
  components: {},
  data() {
    return {
      dialogVisible: this.visible,
      arryList: [],
      page: {
        pageindex: pagination.pageIndex,
        pagesize: pagination.pageSize,
        total: pagination.total
      },
      sum: 0
    }
  },
  created() {
  },
  methods: {
    InitFn() {
      bookRepeat({p: this.page.pageindex}).then(res => {
        console.log('res:', res)
        this.arryList = res.list.data
        this.page.total = res.list.total
        this.sum = res.sum
      })
      // 书藉借阅排行榜
      // let http_ = this.api.book.bookRank
      // if (Number(this.rankingType) === 2) {
      //   // 人员借阅排行榜
      //   http_ = this.api.book.userRank
      //   this.fromDatauser.realname = this.name
      //   this.fromDatauser.p = this.page.pageindex
      // } else {
      //   this.fromDatabook.name = this.name
      //   this.fromDatabook.p = this.page.pageindex
      // }
      // this.$fetch(http_, Number(this.rankingType) === 2 ? this.fromDatauser : this.fromDatabook).then((response) => {
      //   this.arryList = response.list.data
      //   this.page.total = response.list.total
      // }).catch((err) => {
      //   console.log(err)
      // })
    },
    handleSizeChange(val) {
      this.page.pageindex = val
      this.InitFn()
    },
    closePage() {
      this.$emit('update:visible', false)
    },
    sumRate(item){
      return ((item.repeat_number/this.sum)*100).toFixed(2)+'%'
    }
  },
  watch: {
    visible() {
      this.dialogVisible = this.visible
      if (this.visible) {
        this.InitFn()
      } else {
        this.page.pageindex = 1
        this.arryList = []
        this.sum = 0
      }
    }
  },
  mounted() {

  }
}
</script>
